(function () {
    class Swiper {
        constructor(el) {
            this.$el = el;
            this.$left = this.$el.find('.banner-left')
            this.$tab = this.$el.find('.tab-pannel');
            this.$ul = this.$el.find('ul');
            this.$imgIndex = 0;
            this.$pointIndex = 0;
            this.timer = setInterval(() => {
                this.$imgIndex++;
                this.$pointIndex++;
                this.autoPlay();
            }, 2000);
            this.init();
            this.mouseHandler();
            this.clickHandler()
        }
        init() {
            let $clonetab = this.$tab.eq(0).clone(true);
            this.$left.append($clonetab);
            for (var i = 0; i < this.$left.children().length - 1; i++) {
                $(`<li class=${i == 0 ? 'current' : ''}>${i + 1}</li>`).appendTo(this.$ul);

            }
        }
        autoPlay() {
            if (this.$imgIndex > 5) {
                this.$imgIndex = 1;
                this.$left.css({
                    left: '0px'
                })
            }
            this.$left.animate({ left: this.$imgIndex * -990 },500);
            if (this.$pointIndex ==5) {
                this.$pointIndex = 0;
            }
            this.$ul.children().eq(this.$pointIndex).addClass('current').siblings().removeClass('current');
        }
        mouseHandler() {
            let self = this;
            this.$el.on("mouseenter", () => {
                clearInterval(this.timer);
            }).on("mouseleave", () => {
                
                this.timer = setInterval(() => {
                    this.$imgIndex++;
                    this.$pointIndex++;
                    this.autoPlay();
                }, 2000);
            })
        }

        clickHandler() {
            let left =this;
            this.$el.on('click', 'ul>li', (e) => {
                clearInterval(this.timer);
                left.$imgIndex = this.$pointIndex = $(e.target).index();
                left.autoPlay();
                
            })
        }


    }
    $.fn.extend({
        _carousel_auto() {
            new Swiper(this);
        },

    })
})()
$(function () {
    $('.banner')._carousel_auto();
    $(document).on('scroll', function () {
        let scrollTop = $(this).scrollTop();
        if (scrollTop > 1000) {
            $('.Fashion_public_right_nav_top').fadeIn(500);
        } else {
            $('.Fashion_public_right_nav_top').fadeOut(500);
        }
    })
    $('.mui-act-top-bg').on('click',function(){
        $('html,body').animate({
            scrollTop:0
        })
    })
    var oImtesScrollTop = [...$('.itemConteiner')].map(item => $(item).offset().top);
    $('.Fashion_public_right_nav_top .floor-nav-box').on('click', function () {
        
        let $index = $(this).index();
      
        $(this).addClass('active').siblings().removeClass('active');
        $('html,body').stop().animate({
            scrollTop: parseInt(oImtesScrollTop[$index - 1])
        })
    })
    var oAlist = [...$('.itemConteiner')].map(item => $(item).offset().top + $(item).height());
    
    $(window).on("scroll", _.debounce(function () {
        let scrollTop = $(document).scrollTop();
       
        var index = oAlist.findIndex(item => Math.ceil(scrollTop) < parseInt(item));
        $('.Fashion_public_right_nav_top .floor-nav-box').eq(index).addClass('active').siblings().removeClass('active')
    }, 100))

})